<template>
  <div class="area">
    <el-card class="area-card" shadow="hover">
      <template #header>
        <span>
          <font-icon class="fa fa-bar-chart" />
          地区填报统计
        </span>
      </template>
      <t-chart
        class="area-echart"
        :init-options="initOptions"
        :option="option"
        theme="tduck-echarts-theme"
      />
    </el-card>
  </div>
</template>

<script>
import TChart from '@/views/components/TChart'
import {getFormRegionalRequest} from "@/api/project/report"

export default {
  components: {TChart},
  props: {
    formKey: {
      type: String,
      default: ''
    }
  },
  data() {
    return {
      initOptions: {
        renderer: 'svg'
      },
      max:0,
      option: {
        tooltip: {
          trigger: 'axis',
          axisPointer: {
            type: 'shadow'
          }
        },
        xAxis: [
          {
            type: 'category',
            data: [],
            axisLabel:{
              interval: 0
            },
            name:'县/市/区'
          }
        ],
        yAxis: [
          {
            name:'份',
            type: 'value',
            splitLine: {
              show: false
            },
            axisLine:{
                show:true
            },
          }
        ],
        series: [
          {
            name: '数量',
            type: 'bar',
            barWidth: 15,
            label: {
              show: true,
              position: 'top',
              color: '#1890FF',
              fontSize: 12,
              formatter: ({data}) => {
                return `${data}`
              }
            },
            itemStyle: {
              borderRadius: 10,
            },
            data: []
          }
        ],
        grid: {
          top: '10%',
          left: '2%',
          right: '10%',
          bottom: '5%',
          containLabel: true
        },
      }
    }
  },
  created() {
    this.getProjectSubmitSource()
  },
  methods: {
    getProjectSubmitSource() {
      getFormRegionalRequest({formKey: this.formKey}).then((res) => {
        if (res.data) {
          for(var key in res.data){
            this.option.xAxis[0].data.push(key)
            let values = Math.floor(Math.random() * 100)
            this.option.series[0].data.push(values)
          }

          var tempArr = JSON.parse(JSON.stringify(this.option.series[0].data))
          tempArr.sort(function(a, b){
              return a - b
          })
          console.log(tempArr,'4444')
          this.max=tempArr[tempArr.length-1]
        }
      })
    },

  }
}
</script>
